import React, { Component } from 'react';
import { connect } from 'react-redux';
import Dataimport_table from './Dataimport_table';
import { Upload, message, Button, Input, Modal } from 'antd';

import { UploadOutlined } from '@ant-design/icons';
import action from '../../store/action';
import { openNotification } from '../../component/Notification';
import { onkeyDown } from '../../store/function';
// import Modal from 'antd/lib/modal/Modal';

class index extends React.Component {
    constructor() {
        super();
        this.state = {
            val: '',
            success_val: ''
        }
    }
    render() {
        const props = {
            name: 'file',
            action: 'http://www.bestzc.cn:8080/materials.web/common/api/uploadFile_notId',
            headers: {
                authorization: 'authorization-text',
            },
            onChange({ file, fileList }) {
                if (file.status !== 'uploading') {
                    if (fileList.length > 1) fileList.splice(0, 1);

                }
                if (file.type == 'application/x-zip-compressed' || file.type == 'application/zip') {
                    if (file.status === 'done') {
                        message.success(`${file.name} 上传成功`);
                        src_fun(file.response.message)
                    } else if (file.status === 'error') {
                        message.error(`${file.name} 上传失败`);
                    }
                } else {
                    message.error(`上传失败,文件格式只能是zip格式`);

                }

            },
        };

        const src_fun = (val) => {
            this.$axios.get(`manager/api/importMaterialsDataFile?importMaterialsDataFile=${val}&lUserCode=${sessionStorage.getItem('admin_key')}`).then((res) => {
                success(res.message);
                this.$axios.get('/manager/api/pageGetimportMaterialsDataRecordList2/0/9999').then((res) => {
                    const { dataImport } = this.props;
                    let new_list = {};
                    [].push.apply(new_list, res.importJsonValueRecordAckItemList)
                    dataImport(new_list);
                }).catch((err) => {
                    console.log(err);
                });
            }).catch((err) => {
                console.log(err);
            })
        }
        function success(val) {
            Modal.success({
                content: val,
            });
        }
        const { Search } = Input;
        return <div>
            <div>
                <Upload {...props} >
                    <Button>
                        <UploadOutlined /> 导入材料
                    </Button>
                </Upload>
            </div>
            <div className="search_div">
                导入用户:
                <Search placeholder="请输入关键字" className="search_input" onChange={(e) => this.handleChange(e)} onKeyUp={(e)=>onkeyDown(e,this.handel_search)}></Search>
                <Button type="primary" className='search_btn' style={{ background: '#FB6137', borderColor: '#FB6137' }} onClick={this.handel_search}>搜索</Button>

            </div>
            <div>
                <Dataimport_table />
            </div>
        </div>
    }
    handleChange = (e) => {

        this.setState({ val: e.target.value })
    }
    handel_search = () => {

        this.$axios.get(`/manager/api/pageGetimportMaterialsDataRecordList2/0/9999?userlName=${this.state.val}`).then((res) => {
            const { dataSearch } = this.props;
            let new_list = {};
            [].push.apply(new_list, res.importJsonValueRecordAckItemList)
            dataSearch(new_list);
            if (res.importJsonValueRecordAckItemList.length == 0) {
                return openNotification('暂无该用户资料!')
            }
        }).catch((err) => {
            console.log(err);
        });

    }
}

export default connect(state => ({ ...state.custom }), action.custom)(index);